﻿/* CSS Document */
/*common*/
.title {margin-bottom: 40px;text-align: center;}
.title h2{width:100%;font-size: 28px;font-weight:700;color:#333;line-height:40px;}
.title p {color: #999;font-size: 14px;line-height:14px;margin: 5px 0 0;}
.title:after {display: block;content: '';width: 38px;height: 3px;margin: 15px auto 0;background-color: #023793;}
.pd80{padding:80px 0;}
/*about*/
.about {position:relative;width:100%;height:auto;overflow:hidden;}
.about>.container>.inner {width:1120px;margin:0 10px;padding:50px 0;}
.about .inner  .article{width:550px;height:auto;z-index:1;margin:0 20px;background:#fff;padding:15px 10px;float:right;}
.about .inner  .article{font:normal 300 13px/20px microsoft yahei,sans-serif;}
.about .ab-ing{float:left;width:510px;height:260px;overflow:Hidden;}
.about .ab-ing img{width:100%;height:auto;}
.about-logo{top:20px;position:absolute;width:420px;margin:0 calc(50% - 210px);height:65px;overflow:hidden;}
.about-logo img{float:left;width:55px;height:55px;margin-right:10px;}

.information{padding:20px;margin:30px 0;} 
.information li a{color:#000;}
.information li a:hover{color:#023793;}
.information li{float:left;}
.information li:nth-child(1){width:calc(45% - 20px);float:left;margin:5px 0px 5px 20px;padding:0;overflow:hidden;}
.information li:nth-child(2){width:55%;max-height:405px;overflow:hidden;}
.information li dt {padding-bottom:3px;border-bottom: rgba(2,55,147,0.1) 1px solid;}
.information li .info-img{width:calc(100% - 40px);float:left;overflow:hidden;padding:10px 0px 10px 30px;}
.information li .text-con{width:calc(100% - 40px);float:left;overflow:hidden;padding:0 20px;}
.information li .info-img img{width:auto;height:340px;}
.information li .text-con .news-title{width:100%;font:300 13px/18px 'microsoft yahei', serif;overflow:hidden;height:18px;text-align:center;}
.information li .date{height:48px;float:left;margin:15px 20px 0 15px;}
.information li .date .day{font-size:42px;float:left;line-height:48px;color:#023793;}
.information li .date .m-y{float:left;margin-left:8px;text-align:center;color:#444;}
.information li .date .m-y .mm{font-size:16px;border-bottom:#023793 1px solid;}
.information li .date .m-y .yyyy{font-size:16px;}
.news-con h4{font:600 16px/24px 'microsoft yahei', serif;height:26px;overflow:hidden;border-bottom:#023793 1px dotted;padding:2px 0 0 0;}
.news-con h4 a{color:#023793;}
.news-con h4 a:hover{color:#444;text-decoration:underline}
.news-con p{height:48px;overflow:hidden;padding:4px 15px 4px 0;}
 /* news-box */
.news-box{width:100%;height:auto;margin:10px auto 30px;padding:20px 0;}
/* news-box slide */
.htmleaf-container {width:360px;height:280px;float:left;margin:0 auto;text-align:center;overflow:hidden;}
 #slider {width:100%;height:240px;position:relative;overflow:hidden;}
@keyframes load {from {left:-100%;}
to {left:0;}
}
.slides {width:400%;height:100%;position:relative;-webkit-animation:slide 30s infinite;-moz-animation:slide 30s infinite;animation:slide 30s infinite;}
.slider {width:25%;height:100%;float:left;position:relative;z-index:1;overflow:hidden;}
.slide img {width:100%;height:100%;}
.slide img {width:100%;height:100%;}
.image {width:100%;height:100%;}
.image img {width:100%;height:100%;}
/* Legend */.legend {/*border:500px solid transparent;border-left:800px solid rgba(52,73,94,.7);*/border-bottom:0;position:absolute;bottom:0;}
/* Contents */.content {width:100%;height:100%;position:absolute;overflow:hidden;}
.content-txt {width:300px;height:100px;float:left;position:relative;top:90px;-webkit-animation:content-s 7.5s infinite;-moz-animation:content-s 7.5s infinite;animation:content-s 7.5s infinite;}
.content-txt h4 {font-family:Intro;font-size:24px;color:#fff;text-align:left;margin-left:15px;padding-bottom:10px;}
.content-txt h5 {font-family:Quicksand;font-weight:normal;font-size:14px;font-style:italic;color:#fff;text-align:left;margin-left:15px;}
/* Switch slide*/
.switch {width:120px;height:10px;position:absolute;bottom:30px;z-index:99;left:15px;}
.switch > ul {list-style:none;}
.switch > ul > li {width:10px;height:10px;border-radius:50%;background:#0090D6;float:left;margin-right:5px;cursor:pointer;}
.switch ul {overflow:hidden;}
.on {width:100%;height:100%;border-radius:50%;background:#f39c12;position:relative;-webkit-animation:on 30s infinite;-moz-animation:on 30s infinite;animation:on 30s infinite;}

/* Animation */@-webkit-keyframes slide {0%,100% {margin-left:0%;}
21% {margin-left:0%;}
25% {margin-left:-100%;}
46% {margin-left:-100%;}
50% {margin-left:-200%;}
71% {margin-left:-200%;}
75% {margin-left:-300%;}
96% {margin-left:-300%;}
}
@-moz-keyframes slide {0%,100% {margin-left:0%;}
21% {margin-left:0%;}
25% {margin-left:-100%;}
46% {margin-left:-100%;}
50% {margin-left:-200%;}
71% {margin-left:-200%;}
75% {margin-left:-300%;}
96% {margin-left:-300%;}
}
@keyframes slide {0%,100% {margin-left:0%;}
21% {margin-left:0%;}
25% {margin-left:-100%;}
46% {margin-left:-100%;}
50% {margin-left:-200%;}
71% {margin-left:-200%;}
75% {margin-left:-300%;}
96% {margin-left:-300%;}
}
@-webkit-keyframes content-s {0% {left:-420px;}
10% {left:0px;}
30% {left:0px;}
40% {left:0px;}
50% {left:0px;}
60% {left:0px;}
70% {left:0;}
80% {left:-420px;}
90% {left:-420px;}
100% {left:-420px;}
}
@-moz-keyframes content-s {0% {left:-420px;}
10% {left:0px;}
30% {left:0px;}
40% {left:0px;}
50% {left:0px;}
60% {left:0px;}
70% {left:0;}
80% {left:-420px;}
90% {left:-420px;}
100% {left:-420px;}
}
@keyframes content-s {0% {left:-420px;}
10% {left:20px;}
15% {left:0px;}
30% {left:0px;}
40% {left:0px;}
50% {left:0px;}
60% {left:0px;}
70% {left:0;}
80% {left:-420px;}
90% {left:-420px;}
100% {left:-420px;}
}
@-webkit-keyframes on {0%,100% {margin-left:0%;}
21% {margin-left:0%;}
25% {margin-left:15px;}
46% {margin-left:15px;}
50% {margin-left:30px;}
71% {margin-left:30px;}
75% {margin-left:45px;}
96% {margin-left:45px;}
}
@-moz-keyframes on {0%,100% {margin-left:0%;}
21% {margin-left:0%;}
25% {margin-left:15px;}
46% {margin-left:15px;}
50% {margin-left:30px;}
71% {margin-left:30px;}
75% {margin-left:45px;}
96% {margin-left:45px;}
}
@keyframes on {0%,100% {margin-left:0%;}
21% {margin-left:0%;}
25% {margin-left:15px;}
46% {margin-left:15px;}
50% {margin-left:30px;}
71% {margin-left:30px;}
75% {margin-left:45px;}
96% {margin-left:45px;}
}
/* banner*/
.banner{position:relative;width:100vw;max-width:100%;height:auto;/*max-height:600px;*/overflow:hidden;}
.slideshow {position:absolute;width:100vw;max-width:100%;height:70vh;max-height:600px;overflow:hidden;}
.slideshow-image {position:absolute;width:100%;height:100%;background:no-repeat 50% 50%;background-size:cover;-webkit-animation-name:kenburns;animation-name:kenburns;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-duration:16s;animation-duration:16s;opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
.slideshow-image:nth-child(1) {-webkit-animation-name:kenburns-1;animation-name:kenburns-1;z-index:3;}
.slideshow-image:nth-child(2) {-webkit-animation-name:kenburns-2;animation-name:kenburns-2;z-index:2;}
.slideshow-image:nth-child(3) {-webkit-animation-name:kenburns-3;animation-name:kenburns-3;z-index:1;}
.slideshow-image:nth-child(4) {-webkit-animation-name:kenburns-4;animation-name:kenburns-4;z-index:0;}
.slideshow-image:nth-child(5) {-webkit-animation-name:kenburns-5;animation-name:kenburns-5;z-index:4;}
@-webkit-keyframes kenburns-1 {0% {opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
1.5625% {opacity:1;}
23.4375% {opacity:1;}
26.5625% {opacity:0;-webkit-transform:scale(1);transform:scale(1);}
100% {opacity:0;-webkit-transform:scale(1.2);transform:scale(1.2);}
98.4375% {opacity:0;-webkit-transform:scale(1.21176);transform:scale(1.21176);}
100% {opacity:1;}
}
@keyframes kenburns-1 {0% {opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
1.5625% {opacity:1;}
23.4375% {opacity:1;}
26.5625% {opacity:0;-webkit-transform:scale(1);transform:scale(1);}
100% {opacity:0;-webkit-transform:scale(1.2);transform:scale(1.2);}
98.4375% {opacity:0;-webkit-transform:scale(1.21176);transform:scale(1.21176);}
100% {opacity:1;}
}
@-webkit-keyframes kenburns-2 {23.4375% {opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
26.5625% {opacity:1;}
48.4375% {opacity:1;}
51.5625% {opacity:0;-webkit-transform:scale(1);transform:scale(1);}
100% {opacity:0;-webkit-transform:scale(1.2);transform:scale(1.2);}
}
@keyframes kenburns-2 {23.4375% {opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
26.5625% {opacity:1;}
48.4375% {opacity:1;}
51.5625% {opacity:0;-webkit-transform:scale(1);transform:scale(1);}
100% {opacity:0;-webkit-transform:scale(1.2);transform:scale(1.2);}
}
@-webkit-keyframes kenburns-3 {48.4375% {opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
51.5625% {opacity:1;}
73.4375% {opacity:1;}
76.5625% {opacity:0;-webkit-transform:scale(1);transform:scale(1);}
100% {opacity:0;-webkit-transform:scale(1.2);transform:scale(1.2);}
}
@keyframes kenburns-3 {48.4375% {opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
51.5625% {opacity:1;}
73.4375% {opacity:1;}
76.5625% {opacity:0;-webkit-transform:scale(1);transform:scale(1);}
100% {opacity:0;-webkit-transform:scale(1.2);transform:scale(1.2);}
}
@-webkit-keyframes kenburns-4 {73.4375% {opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
76.5625% {opacity:1;}
98.4375% {opacity:1;}
100% {opacity:0;-webkit-transform:scale(1);transform:scale(1);}
}
@keyframes kenburns-4 {73.4375% {opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
76.5625% {opacity:1;}
98.4375% {opacity:1;}
100% {opacity:0;-webkit-transform:scale(1);transform:scale(1);}
}
@keyframes kenburns-5 {0% {opacity:1;-webkit-transform:scale(1.2);transform:scale(1.2);}
1.5625% {opacity:1;}
23.4375% {opacity:1;}
26.5625% {opacity:0;-webkit-transform:scale(1);transform:scale(1);}
100% {opacity:0;-webkit-transform:scale(1.2);transform:scale(1.2);}
98.4375% {opacity:0;-webkit-transform:scale(1.21176);transform:scale(1.21176);}
100% {opacity:1;}
}
.banner h1 {font-size:16px;position:absolute;top:50%;left:50%;-webkit-transform:translate3d(-50%,-50%,0);transform:translate3d(-50%,-50%,0);z-index:99;text-align:center;font-family:Raleway,sans-serif;font-weight:300;text-transform:uppercase;background-color:rgba(255,255,255,0.75);box-shadow:0 1em 2em -1em rgba(0,0,0,0.5);padding:1em 2em;line-height:1.5;}
.banner h1 small {display:block;text-transform:lowercase;font-size:14px;}
.banner h1 small b{font-size:24px;}
.banner h1 small:first-child {border-bottom:1px solid rgba(0,0,0,0.25);padding-bottom:.5em;}
.banner h1 small:last-child {border-top:1px solid rgba(0,0,0,0.25);padding-top:.5em;}

/*news-box  title-box */

.art-tlt-inner{margin: 0 0 20px;}
.art-tlt-inner h1 {font-size: 22px;}
.art-tlt-inner small {display: block;color: #999;font-weight: normal;font-size: 14px;}
.art-tlt-inner:after {display: block;content: '';width: 38px;height: 3px;margin: 10px 0 0;background-color: #023793;}
.about .article p {margin: 0;text-align: justify;color: #666;line-height: 1.8;}
.about .article .btn {margin-top: 30px;}
.about .article .btn a {display: inline-block;margin-right: 15px;line-height: 38px;background-color: #023793;color: #fff;padding: 0 30px;}

.txt-news-box{width:calc(100% - 375px);height:280px;float:right;overflow:hidden;padding:0px 15px 10px;}
.txt-news-box li{width:calc(50% - 20px);float:left;line-height:36px;border-bottom:dotted 1px #f0f0f0;font:100 14px/36px 'microsoft yahei', serif;color:#3f3b3a;}
.txt-news-box ul {margin:9px 0;}
.txt-news-box ul li:nth-child(even){margin-left:40px;}
.txt-news-box ul li:nth-child(n+13){display:none;}
.txt-news-box li .news-title{width:auto;height:36px;overflow:hidden;float:left;}
.txt-news-box li span{float:right;}
.txt-news-box li a{color:#3f3b3a;text-decoration:none;float:left;}
.hot-products{padding:20px;margin:50px 0;} 
 
.category-box {text-align: center;font-size: 0;margin-bottom: 20px;}
.category-box li {display: inline-block;vertical-align: middle;}
.category-box li a {display: block;margin: 0 5px 10px;font-size: 14px;line-height: 39px;position: relative;background:#D8D8D8;width: 175px;}
.category-box li a:before,.category-box li a:after {position: absolute;content: '';background-color: #fff;width: 16px;height: 1px;top: 50%;display: none;}
.category-box li a:before {left: 33px;}
.category-box li a:after {right: 33px;}
.category-box li a:hover {color: #fff;background:#023793;}
.category-box li a:hover:before,.category-box li a:hover:after {display: block;}
.hot-products-list{margin:30px 40px 0px;}
.hot-products-list li{float:left;width:calc(25% - 10px);height:auto;margin:0 5px 5px;padding:10px;}
.hot-products-list li h3{text-align:center;line-height:32px;height:32px;font-size:14px;overflow:hidden;}
.hot-products-list li h3 a{color:#000;}
.hot-products-list li .pro-img-box{width:100%;max-height:180px;overflow:hidden;}
.hot-products-list li img{width:100%;height:auto;min-height:180px;}
.hot-products-list li .text {line-height: 40px;background-color: #e6e6e6;text-align: center;margin: 2px 0 0;position: relative;}
.hot-products-list li .text:before {content: '';position: absolute;left: 50%;width: 0;height: 100%;background-color: #023793;transition: all 0.5s;}
.hot-products-list li .text h3 {margin: 0;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;position: relative;z-index: 1;transition: all 0.5s;}
.hot-products-list li a:hover .text:before {width: 100%;left: 0;}
.hot-products-list li a:hover .text h3 {color: #fff;}

@media only screen and (max-width:1200px) {
.category-box li a {width: 135px;}
}
@media only screen and (max-width:960px) {
.hot-products-list li{width:calc(50% - 10px);height:auto;}
.txt-news-box li .news-title{width:150px;height:36px;overflow:hidden;float:left;}
.news-list{width:100%;float:none;}
.news-list li {margin:15px 10px;}
.information li:nth-child(1),.information li:nth-child(2){width:calc(100% - 20px);float:none;padding:10px 0;}
 .information li .info-img{width:100%;padding:10px 0;}
	}
@media only screen and (max-width:900px) {
	.pd80{padding:40px 0;}
.title-box,.txt-news-box,.top-notes{width: calc(100% - 30px);margin: 10px 15px;padding: 0px 0px 10px;}	
.htmleaf-container {width: calc(100% - 30px);height:400px;margin: 10px  15px;}
 #slider {width:720px;height:480px;margin: 10px  calc(50% - 360px);}	
.content-txt {top:210px;}
.switch {bottom:150px;} 
.txt-news-box li{width:100%;}
.txt-news-box ul li:nth-child(even){margin:0;}
.txt-news-box{height:auto;}
.txt-news-box li .news-title{width:auto;}
	.about>.container>.inner{width:calc(100% - 20px);padding:30px 0;}
.about .ab-ing,.about .inner  .article{float:none;width:100%;height:auto;margin:10px 0;}
.art-tlt-inner{text-align:center;}
.art-tlt-inner:after {margin: 10px calc(50% - 19px) 0;}
.information li .info-img img {
    width: 100%;
    height: auto;
}
.hot-products-list li .pro-img-box {max-height: 100%;}
.about .article .btn{display:none;}
}	

@media only screen and (max-width:768px) {	
.banner .banner-text-box{float:none;padding:10px 10px 30px;width:100%;height:auto;}
.banner .banner-img-box{float:none;width:100%;height:500px;overflow:hidden;}
.banner {margin:20px 0 0px;}
.banner .banner-text-box .contact{margin:20px 0 0 0;float:Left;width:160px;padding:0 15px;}
.banner .banner-text-box .learn{margin:20px 0 0 0;padding-left:30px;}

#slider {width:600px;height:400px;margin: 10px  calc(50% - 300px);}	
.content-txt {top:220px;} 
.switch {bottom:70px;}
.content-txt {top:210px;}
.switch {bottom:70px;}

.type-title-box{margin:5px calc(25% - 45px);}
.type-h3::before {left:32%;}
.hot-products .h2tlt{margin:30px 20px 20px;}
.hot-products-list{margin:30px 0px 0px;}
 
.hot-products-list li{width:calc(50% - 20px);height:auto;margin:0 10px;}
	.hot-products-list li img{min-height:200px;}
.hot-products{padding:15px;}
.technology{margin:15px auto 2px;}
.Knowledge-img-box{width:80%;margin:20px 10%;max-height:180px;}
.education p{font:500 14px/18px "Poppins", Helvetica, Arial, sans-serif;margin:20px;}
.application ul li:nth-child(1),.application ul li:nth-child(2),.application ul li:nth-child(3),.application ul li:nth-child(4),.application ul li:nth-child(5){width:calc(100% - 30px);margin:10px 15px;}
.superior{margin:20px auto;}
.superior .title-con,.superior .art-con{width:100%;}
.superior h2{padding:0 10%;font:800 24px/36px "Times New Roman",'microsoft yahei', serif; }
.superior .art-con p{padding:10px 5%;}	
.superior-more {font:500 16px/20px "Poppins", Helvetica, Arial, sans-serif;padding:30px 0px 20px 20px;}
.img-con{width:100%;height:auto;margin:30px 0;float:Left;}
.img-con img{width:80%;height:auto;margin:0 10%;}
.notes{padding:20px 0;}
.category-box li {width:25%;padding:0 10px;}	
.category-box li a {width: 100%;}
}
@media only screen and (max-width:640px) {	
.type-h3::before {display:none;}
.type-h3:after{width:100%;border-bottom:2px solid rgba(245,245,247,1);left:0%;}
#slider {width:360px;height:240px;margin: 10px  calc(50% - 180px);}	
.content-txt {top:90px;} 
.switch {bottom:30px;}
 .category-box li {width:33.333%;padding:0 10px;}	
}
@media only screen and (max-width:480px) {	
	.hot-products-list li{width:calc(100% - 20px);margin:0 10px;}
.category-box li {width:50%;padding:0 10px;}	
}
@media only screen and (max-width:359px) {.type-title-box{margin:5px 30px;width:calc(100% - 60px);}
.banner .banner-text-box .contact{margin:20px calc(50% - 80px) 0;}
.banner .banner-text-box .learn{margin:20px calc(50% - 80px) 0;padding-left:0px;text-algin:center;}
.application ul li .con a{font:400 24px/30px Times, "Times New Roman",'microsoft yahei', serif;}
.h2tlt{font:600 24px/32px "Times New Roman",'microsoft yahei', serif;}

}
